import React from 'react'
import { ScanningOutline, SetOutline } from 'antd-mobile-icons'
import { Avatar, Space } from 'antd-mobile'
import '../../static/In_Login/In_Login.css'
import { useNavigate } from 'react-router-dom'
export default function In_Login() {
    const navigate = useNavigate()
    return (
        <div className='In_Login_box'>
            <div className='In_Login_title'>
                <ScanningOutline color='white' />
                <SetOutline color='white' />
            </div>
            <div className='In_Login_mains'>
                <div className='In_Login_Avatars'>
                    <Space block direction='vertical'>
                        <Avatar src='https://images.unsplash.com/photo-1548532928-b34e3be62fc6?ixlib=rb-1.2.1&q=80&fm=jpg&crop=faces&fit=crop&h=200&w=200&ixid=eyJhcHBfaWQiOjE3Nzg0fQ' style={{ '--size': '8rem', '--border-radius': '5rem' }} />
                    </Space>
                </div>
                <div className='In_Login_Avatar_content'>
                    <ul className='In_Login_ul'>
                        <li>
                            <p>104</p>
                            <p>关注</p>
                        </li>
                        <li>
                            <p>6,152</p>
                            <p>粉丝</p>
                        </li>
                        <li>
                            <p>6.1万</p>
                            <p>获赞</p>
                        </li>
                    </ul>
                </div>
                <div className='In_Login_name'>
                    <h2>晚风心里吹</h2>
                    <div className='In_Login_sex'>
                        <div>
                            <span>Lv 1 </span>
                            <span>男</span>
                        </div>
                        <span onClick={() => navigate('/mainArticles')}>个人主页</span>
                    </div>
                </div>
                <div className='In_Login_top'>
                    <div className='In_Login_top_left'>
                        <div>
                            <img src="/img/优惠券.png" alt="" width='50px' />
                        </div>
                        <div>
                            <span>优惠券：3张</span>
                        </div>
                    </div>
                    <div className='In_Login_top_rigth'>
                        <div>
                            <img src="/img/金币.png" alt="" width='50px' />
                        </div>
                        <div>
                            <span>金币：30，3000个</span>
                        </div>
                    </div>
                </div>
                <div className='In_Login_b_admission'>
                    <h3>我的门票</h3>
                    <div className='In_Login_admission'>
                        <div onClick={() => navigate('/order')}>
                            <img src="/img/文档.png" alt="" width='40px' />
                            <p>全部门票</p>
                        </div>
                        <div>
                            <img src="/img/我的钱包.png" alt="" width='40px' />
                            <p>待付款</p>
                        </div>
                        <div>
                            <img src="/img/时钟-fill.png" alt="" width='40px' />
                            <p>未使用</p>
                        </div>
                        <div>
                            <img src="/img/消息.png" alt="" width='40px' />
                            <p>待评价</p>
                        </div>
                    </div>
                </div>
                <div className='In_Login_a_admissions'>
                    <h3>基础服务</h3>
                    <div className='In_Login_admissions'>
                        <div className='In_Login_aaa' onClick={() => {
                            navigate('/publish')
                        }}>
                            <img src="/img/纸飞机.png" alt="" width='40px' />
                            <p>我要发布</p>
                        </div>
                        <div className='In_Login_aaa'>
                            <img src="/img/文档2.png" alt="" width='40px' />
                            <p>酒单订单</p>
                        </div>
                        <div className='In_Login_aaa'>
                            <img src="/img/纸飞机.png" alt="" width='40px' />
                            <p>我的机票</p>
                        </div>
                        <div className='In_Login_aaa'>
                            <img src="/img/书籍.png" alt="" width='40px' />
                            <p>我的车票</p>
                        </div>
                        <div className='In_Login_aaa'>
                            <img src="/img/金币2.png" alt="" width='40px' />
                            <p>我的金币</p>
                        </div>
                        <div className='In_Login_aaa'>
                            <img src="/img/星.png" alt="" width='40px' />
                            <p>我的收藏</p>
                        </div>
                        <div className='In_Login_aaa'>
                            <img src="/img/客服.png" alt="" width='40px' />
                            <p>联系客服</p>
                        </div>
                        <div className='In_Login_aaa'>
                            <img src="/img/消息2.png" alt="" width='40px' />
                            <p>意见反馈</p>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    )
}
